<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('订单详情')" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal" th:object="${wcComOrder}">
            <div class="form-group">
                <label class="col-sm-2 control-label">订单号：</label>
                <div class="col-sm-4">
                    <input type="text" placeholder="" class="form-control" th:field="*{ordernum}">
                </div>
                <label class="col-sm-2 control-label">车辆品名：</label>
                <div class="col-sm-4">
                    <input type="text" placeholder="" class="form-control" th:field="*{carname}">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">客户姓名：</label>
                <div class="col-sm-4">
                    <input type="text" placeholder="" class="form-control" th:field="*{username}">
                </div>
                <label class="col-sm-2 control-label">电话：</label>
                <div class="col-sm-4">
                    <input type="text" placeholder="" class="form-control" th:field="*{userMobile}">
                </div>
            </div>
        </form>

        <hr>

        <div class="tabs-container">
            <ul class="nav nav-tabs">
                <li class="active"><a data-toggle="tab" href="#tab-1" aria-expanded="true">基本信息</a>
                </li>
                <li class=""><a data-toggle="tab" href="#tab-2" aria-expanded="false">工作信息</a>
                </li>
                <li class=""><a data-toggle="tab" href="#tab-3" aria-expanded="true">担保人信息</a>
                </li>
                <li class=""><a data-toggle="tab" href="#tab-4" aria-expanded="false">车辆信息</a>
                </li>
                <li class=""><a data-toggle="tab" href="#tab-5" aria-expanded="false">图片采集</a>
                </li>
                <li class=""><a data-toggle="tab" href="#tab-6" aria-expanded="true">初审查询</a>
                </li>
                <li class=""><a data-toggle="tab" href="#tab-7" aria-expanded="false">银行卡查询</a>
                </li>
                <li class=""><a data-toggle="tab" href="#tab-8" aria-expanded="false">工作查询</a>
                </li>
                <li class=""><a data-toggle="tab" href="#tab-0" aria-expanded="true">审批进度</a>
                </li>

            </ul>
            <div class="tab-content">
                <div id="tab-1" class="tab-pane active">
                    <div class="panel-body">
                        <form class="form-horizontal" th:object="${wcComOrder}">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">客户姓名：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="name">
                                </div>
                                <label class="col-sm-2 control-label">身份证号码：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="idnum">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">手机号码：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="phone">
                                </div>
                                <label class="col-sm-2 control-label">所属车商：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="dealer">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">创客姓名：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="ckname">
                                </div>
                                <label class="col-sm-2 control-label">创客电话：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="ckphone">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">申请额：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="sqdke">
                                </div>
                                <label class="col-sm-2 control-label">性别：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="sex">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">婚姻状况：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="hyzk">
                                </div>
                                <label class="col-sm-2 control-label">学历：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="xueli">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">户籍地地址：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="hjdz">
                                </div>
                                <label class="col-sm-2 control-label">实际居住地地址：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="jzdz">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">住房类型：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="zflx">
                                </div>
                                <label class="col-sm-2 control-label">家庭人口：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="jtrk">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">家庭手机号：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="qyphone">
                                </div>
                                <label class="col-sm-2 control-label">主要收入来源：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="zysrly">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">家庭年收入：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="jtnsr">
                                </div>
                                <label class="col-sm-2 control-label">驾龄：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="jialing">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">居住地邮编：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="jzyb">
                                </div>
                                <label class="col-sm-2 control-label">居住地区：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="jzdq">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">开户银行：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="hkyh">
                                </div>
                                <label class="col-sm-2 control-label">还款银行卡号：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="hkcar">
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
                <div id="tab-2" class="tab-pane">
                    <div class="panel-body">
                        <form class="form-horizontal" th:object="${wcComOrder}">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">公司名称：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="compantname">
                                </div>
                                <label class="col-sm-2 control-label">公司手机号：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="cptphone">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">公司地址：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="cptdress">
                                </div>
                                <label class="col-sm-2 control-label">现任职务：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="xrzw">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">个人月收入：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="grsr">
                                </div>
                                <label class="col-sm-2 control-label">是否缴纳社保：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="sfsb">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">本单位工作年限：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="gznx">
                                </div>
                                <label class="col-sm-2 control-label">合计公龄：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="hjgl">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">工作地区号：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="gzqh">
                                </div>
                                <label class="col-sm-2 control-label">工作地邮编：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="gzyb">
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
                <div id="tab-3" class="tab-pane">
                    <div class="panel-body">
                        <form class="form-horizontal">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">直系亲属姓名：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="zhixqsxm">
                                </div>
                                <label class="col-sm-2 control-label">直系亲属电话：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="zhxqsdh">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">申请人与直系亲属关系：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="zhixqsgx">
                                </div>
                                <label class="col-sm-2 control-label">朋友姓名：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="pengyxm">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">朋友手机号：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="pengysj">
                                </div>
                                <label class="col-sm-2 control-label">担保人姓名：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="danbrxm">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">担保人手机号：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="danbrsj">
                                </div>
                                <label class="col-sm-2 control-label">申请人与担保人关系：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="shenqrydbrgx">
                                </div>
                            </div>

                        </form>
                    </div>
                </div>
                <div id="tab-4" class="tab-pane">
                    <div class="panel-body">
                        <form class="form-horizontal">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">申请类型：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="dklx">
                                </div>
                                <label class="col-sm-2 control-label">二手车：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="esc">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">车抵货：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="cdh">
                                </div>
                                <label class="col-sm-2 control-label">品牌：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="brand">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">车型：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="mototype">
                                </div>
                                <label class="col-sm-2 control-label">指导价：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="zdj">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">颜色：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="colour">
                                </div>
                                <label class="col-sm-2 control-label">排量：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="pail">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">配置：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="peiz">
                                </div>
                                <label class="col-sm-2 control-label">上牌地：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="spd">
                                </div>
                            </div>
                        </form>
                    </div>
                </div>

                <div id="tab-6" class="tab-pane">
                    <div class="panel-body">
                        <form class="form-horizontal">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">车友姓名：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="chus_name">
                                </div>
                                <label class="col-sm-2 control-label">身份证：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="chus_idnum">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">手机号：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="chus_phone">
                                </div>
                                <label class="col-sm-2 control-label">初审分数：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="score">
                                </div>
                            </div>
                        </form>
                    </div>
                </div>

                <div id="tab-7" class="tab-pane">
                    <div class="panel-body">
                        <form class="form-horizontal">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">车友姓名：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="bank_name">
                                </div>
                                <label class="col-sm-2 control-label">身份证：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="bank_idnum">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">手机号：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="bank_phone">
                                </div>
                                <label class="col-sm-2 control-label">银行卡号：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="bank_hkcar">
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 control-label">四要素匹配结果：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="bankresult">
                                </div>

                            </div>
                        </form>
                    </div>
                </div>

                <div id="tab-8" class="tab-pane">
                    <div class="panel-body">
                        <form class="form-horizontal">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">车友姓名：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="work_name">
                                </div>
                                <label class="col-sm-2 control-label">身份证号：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="work_idnum">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">工作单位：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="work_company">
                                </div>
                                <label class="col-sm-2 control-label">工作单位查询结果：</label>
                                <div class="col-sm-4">
                                    <input type="text" placeholder="" class="form-control" id="workresult">
                                </div>

                            </div>
                        </form>
                    </div>
                </div>

                <div id="tab-5" class="tab-pane">
                    <div class="panel-body">
                        <div id="tupian"></div>
                    </div>
                </div>

                <div id="tab-0" class="tab-pane">
                    <div class="panel-body">
                        <div id="timeline"></div>
                    </div>
                </div>

            </div>


        </div>
    </div>
    <th:block th:include="include :: footer" />
    <script type="text/javascript" th:inline="javascript">
        var prefix = ctx + "system/wcorder";
        $("#form-wcorder-edit").validate({
            focusCleanup: true
        });

        function submitHandler() {
            if ($.validate.form()) {
                $.operate.save(prefix + "/edit", $('#form-wcorder-edit').serialize());
            }
        }

        var _orderNum = [[${wcComOrder.ordernum}]];
        var _userId = [[${wcComOrder.userid}]];

        $.ajax({
            url: ctx + "system/info/list",
            contentType: "application/json;charset=UTF-8",
            data: JSON.stringify({
                orderid: _orderNum
            }),
            type: 'POST',
            success: function (result) {
                console.log(result);
                if(result.rows.length > 0) {
                    $("#name").val(result.rows[0].name);
                    $("#idnum").val(result.rows[0].idnum);
                    $("#phone").val(result.rows[0].phone);
                    $("#dealer").val(result.rows[0].dealer);
                    $("#ckname").val(result.rows[0].ckname);
                    $("#ckphone").val(result.rows[0].ckphone);
                    $("#sqdke").val(result.rows[0].sqdke);
                    $("#sex").val(result.rows[0].sex);
                    $("#hyzk").val(result.rows[0].hyzk);
                    $("#xueli").val(result.rows[0].xueli);
                    $("#hjdz").val(result.rows[0].hjdz);
                    $("#jzdz").val(result.rows[0].jzdz);
                    $("#jtrk").val(result.rows[0].jtrk);
                    $("#qyphone").val(result.rows[0].qyphone);
                    $("#zysrly").val(result.rows[0].zysrly);
                    $("#jtnsr").val(result.rows[0].jtnsr);
                    $("#jialing").val(result.rows[0].jialing);
                    $("#jzdq").val(result.rows[0].jzdq);
                    $("#hkyh").val(result.rows[0].hkyh);
                }
            }
        });

        $.ajax({
            url: ctx + "system/workinfo/list",
            contentType: "application/json;charset=UTF-8",
            data: JSON.stringify({
                orderid: _orderNum
            }),
            type: 'POST',
            success: function (result) {
                console.log(result);
                if(result.rows.length > 0) {
                    $("#compantname").val(result.rows[0].compantname);
                    $("#cptphone").val(result.rows[0].cptphone);
                    $("#cptdress").val(result.rows[0].cptdress);
                    $("#xrzw").val(result.rows[0].xrzw);
                    $("#grsr").val(result.rows[0].grsr);
                    $("#sfsb").val(result.rows[0].sfsb);
                    $("#gznx").val(result.rows[0].gznx);
                    $("#hjgl").val(result.rows[0].hjgl);
                    $("#gzqh").val(result.rows[0].gzqh);
                    $("#gzyb").val(result.rows[0].gzyb);

                }
            }
        });

        $.ajax({
            url: ctx + "system/danbrInfo/list",
            contentType: "application/json;charset=UTF-8",
            data: JSON.stringify({
                ordernum: _orderNum
            }),
            type: 'POST',
            success: function (result) {
                console.log(result);
                if(result.rows.length > 0) {
                    $("#zhixqsxm").val(result.rows[0].zhixqsxm);
                    $("#zhxqsdh").val(result.rows[0].zhxqsdh);
                    $("#cptdress").val(result.rows[0].cptdress);
                    $("#zhixqsgx").val(result.rows[0].zhixqsgx);
                    $("#pengyxm").val(result.rows[0].pengyxm);
                    $("#pengysj").val(result.rows[0].pengysj);
                    $("#danbrxm").val(result.rows[0].danbrxm);
                    $("#danbrsj").val(result.rows[0].danbrsj);
                    $("#shenqrydbrgx").val(result.rows[0].shenqrydbrgx);
                }
            }
        });

        $.ajax({
            url: ctx + "system/carinfo/list",
            contentType: "application/json;charset=UTF-8",
            data: JSON.stringify({
                orderid: _orderNum
            }),
            type: 'POST',
            success: function (result) {
                console.log(result);
                if(result.rows.length > 0) {
                    $("#dklx").val(result.rows[0].dklx);
                    $("#esc").val(result.rows[0].esc);
                    $("#cdh").val(result.rows[0].cdh);
                    $("#brand").val(result.rows[0].brand);
                    $("#mototype").val(result.rows[0].mototype);
                    $("#zdj").val(result.rows[0].zdj);
                    $("#colour").val(result.rows[0].colour);
                    $("#pail").val(result.rows[0].pail);
                    $("#peiz").val(result.rows[0].peiz);
                    $("#spd").val(result.rows[0].spd);
                }
            }
        });

        $.ajax({
            url: ctx + "system/firstAuditReport/list",
            contentType: "application/json;charset=UTF-8",
            data: JSON.stringify({
                ordernum: _orderNum
            }),
            type: 'POST',
            success: function (result) {
                console.log(result);
                if(result.rows.length > 0) {
                    $("#chus_phone").val(result.rows[0].phone);
                    $("#chus_name").val(result.rows[0].name);
                    $("#chus_idnum").val(result.rows[0].idnum);
                    $("#score").val(result.rows[0].score);
                }
            }
        });

        $.ajax({
            url: ctx + "system/bankReport/list",
            contentType: "application/json;charset=UTF-8",
            data: JSON.stringify({
                ordernum: _orderNum
            }),
            type: 'POST',
            success: function (result) {
                console.log(result);
                if(result.rows.length > 0) {
                    $("#bank_phone").val(result.rows[0].phone);
                    $("#bank_name").val(result.rows[0].name);
                    $("#bank_idnum").val(result.rows[0].idnum);
                    $("#bank_hkcar").val(result.rows[0].hkcar);
                    $("#bankresult").val(result.rows[0].bankresult);
                }
            }
        });

        $.ajax({
            url: ctx + "system/workReport/list",
            contentType: "application/json;charset=UTF-8",
            data: JSON.stringify({
                ordernum: _orderNum
            }),
            type: 'POST',
            success: function (result) {
                console.log(result);
                if(result.rows.length > 0) {
                    $("#work_name").val(result.rows[0].phone);
                    $("#work_idnum").val(result.rows[0].idnum);
                    $("#work_company").val(result.rows[0].compantname);
                    $("#workresult").val(result.rows[0].workresult);
                }
            }
        });

        $.ajax({
            url: ctx + "system/imgPath/list",
            contentType: "application/json;charset=UTF-8",
            data: JSON.stringify({
                orderid: _orderNum
            }),
            type: 'POST',
            success: function (result) {
                console.log(result);
                if(result.rows.length > 0) {
                    console.log((result));
                    result.rows.forEach(element => {
                        $("#tupian").append("<h3>" + element.typeName + "</h3>");
                        var tmp = "";
                        element.imageList.forEach(element2 => {
                            tmp += "<img src=\"" + element2 + "\" class=\"img-thumbnail\" style='width: 30%'>";
                        })
                        $("#tupian").append(tmp);
                        $("#tupian").append("<hr>");
                    })

                }
            }
        });

        $.ajax({
            url: ctx + "system/wcorder/myHistoryProcess?userId=" + _userId,
            contentType: "application/json;charset=UTF-8",
            type: 'GET',
            success: function (result) {
                console.log(result);
                if(result.length > 0) {
                    console.log((result));
                    result.forEach(element => {
                        $("#timeline").append("<h2>" + element.status + "</h2>");
                        $("#timeline").append("<h3>" + element.activityName + "</h3>");
                        $("#timeline").append("<h4>处理人: " + element.assignee + "</h4>");
                        $("#timeline").append("<h4>审批意见: " + element.fullMessage + "</h4>");
                        $("#timeline").append("<h4>开始时间: " + element.startTime + "</h4>");
                        $("#timeline").append("<h4>结束时间: " + element.endTime + "</h4>");
                        $("#timeline").append("<h4>耗时: " + element.duration + "</h4>");
                        $("#timeline").append("<hr>");
                    })

                }
            }
        });


    </script>
</body>
</html>